<!--
 * @Description: 
 * @Author: mmzhang
 * @Date: 2022-07-12 11:27:32
 * @LastEditTime: 2022-08-23 16:25:22
-->
<template>
  <dt-modal-edit ref="edit" title="请选择需分入线索的人员" :width="500" :loading="loading" @ok="onOk">
    <div>
      <p style="margin-bottom: 10px;">分配线索后，勾选线索可在分配人员的未到访客户列表查看该线索信息</p>
      <p style="margin-bottom: 10px;text-align:center;color:#ff9900" v-if="receiverFlag">
        当前线索来自于同策好房，只能分配给案场承接人</p>
      <div class="radioGroupClassBox">
        <Input v-model="searchVal" prefix='ios-search' placeholder="输入人员姓名、手机号或工号搜索">
        <!-- <template #append>
          <Button icon="ios-search"></Button>
        </template> -->
        </Input>
        <!-- <dt-grid ref="table" :columns="columns" :onFetch="onFetch" :height="400" /> -->
        <RadioGroup v-model="chooseConsultant" vertical class="radioGroupClass"
          @on-change='raidoChange'>
          <Radio v-for="(item,index) in consultantList" :key="index" :label="item.userId"
            class="radioClass">
            {{item.userName}}({{item.workNo}}) <Tag>{{item.roleList[0].roleName}}</Tag>
          </Radio>
        </RadioGroup>
      </div>
    </div>
  </dt-modal-edit>
</template>

<script>
  import columnOpt from '../opt/allotColumn.js'
  import clueCustomerMgr from '@/biz/customer/clueCustomer.js'
  import publicCustomerMgr from '@/biz/customer/publicCustomer.js'
  export default {
    data() {
      return {
        columns: [],

        loading: false,
        userCustomerId: null,
        distributionWay: '',

        receiverFlag: false,
        publicVal: '',

        // 3.7
        userName: null,
        consultantList: null,
        chooseConsultant: null,
        searchVal: ''
      }
    },
    methods: {
      raidoChange(val) {
        let current = this.consultantList.find(item => {
          return item.userId = val

        })
        if (current) {
          this.userName = current.userName
        }
        console.log(val, this.userName, 'choose');
      },

      onOk() {
        if (!this.chooseConsultant) {
          this.$Message.error('请选择需分入线索的人员')
          return
        }
        console.log(this.publicVal, 'this.publicVal');
        // 这个接口的userCustomerIdList参数原来传的userCustomerId的id集合，现在怎么改成customerId集合
        this.loading = true
        let params = {
          userCustomerIdList: this.userCustomerId,
          userId: this.chooseConsultant,
        }
        if (this.distributionWay) {
          params.distributionWay = this.distributionWay
        }
        if (this.publicVal == 'public') {
          params.publicPoolIdList = this.userCustomerId
          delete params.userCustomerIdList
        }
        if (this.publicVal == 'publicRecord') {
          params.publicPoolDistributionIdList = this.userCustomerId
          delete params.userCustomerIdList
          params.publicPoolIdList && delete params.publicPoolIdList
        }


        this.$Modal.confirm({
          title: '分配客户确认',
          content: `确定将${this.userCustomerId.length}个客户分配给${this.userName}？`,
          closable: true,
          onOk: () => {
            this.$parent.customerIds = []
            this.$parent.assignConfirmFlag = false
            if (this.publicVal == 'public' || this.publicVal == 'publicRecord') {
              publicCustomerMgr.distributePublicCustomer(params).then(res => {
                this.$Message.success('分配成功')
                this.$parent.$refs.table.fetch()
                this.$parent.customerIds = []
                this.$parent.userCustomerId = []
                this.$parent.assignConfirmFlag = false
                this.loading = false
                this.hide()
                this.$emit('detailsDistributeClue')
              }).catch(() => {
                this.loading = false
              })
            } else {
              clueCustomerMgr.distributeClue(params).then(res => {
                this.$Message.success('分配成功')
                this.$parent.$refs.table.fetch()
                this.$parent.customerIds = []
                this.$parent.userCustomerId = []
                this.$parent.assignConfirmFlag = false
                this.loading = false
                this.hide()
                this.$emit('detailsDistributeClue')
              }).catch(() => {
                this.loading = false
              })
            }
          },
          onCancel: () => {
            this.loading = false
          }
        })


      },


      onFetch(data) {
        let params = { onlineType: 1 }
        return clueCustomerMgr.adviserList(params).then((res) => {
          // if (this.receiverFlag) {
          //   res.forEach((item, index) => {
          //     if (item.isReceiver == 1) {
          //       res.unshift(res.splice(index, 1)[0]);
          //     }
          //   });
          // }
          // return res
          this.consultantList = res
        })

      },
      /*
       * recordFlag:线索客户 => 隐私号客户分配 只能分配给案场承接人
       */
      show(val, privacy) {
        // this.loading = false
        // console.log(receiverData, publicVal, val, recordFlag,
        //   '3333333333333333333333');
        // this.receiverFlag = recordFlag ? true : false
        // if (publicVal) {
        //   this.publicVal = publicVal
        // }
        // let flag = ''
        // if (receiverData && receiverData.sourceType) {
        //   flag = receiverData.sourceType == '网络来客'
        // }

        // if (receiverData && (receiverData.relationClueChannel == 10008 || receiverData
        //     .relationClueChannel == 10009) && flag && receiverData.isPrivacy == 1) {
        //   this.receiverFlag = true
        //   this.userCustomerId = [receiverData.userCustomerId]
        // } else if (!val && receiverData.userCustomerId) {

        //   this.userCustomerId = [receiverData.userCustomerId]
        // } else {
        //   this.userCustomerId = val
        // }
        // this.selected = null
        // if (retain) {
        //   this.distributionWay = retain
        // }

        this.userCustomerId = val

        this.$refs.edit.show()
        this.onFetch()
        // this.columns = columnOpt.options(this)
        // this.$refs.table.init(this)
        // this.$refs.table.fetch()
      },
      // show(val, retain, receiverData, publicVal, recordFlag) {
      //   this.loading = false
      //   console.log(receiverData, publicVal, val, recordFlag,
      //     '3333333333333333333333');
      //   this.receiverFlag = recordFlag ? true : false
      //   if (publicVal) {
      //     this.publicVal = publicVal
      //   }
      //   let flag = ''
      //   if (receiverData && receiverData.sourceType) {
      //     flag = receiverData.sourceType == '网络来客'
      //   }

      //   if (receiverData && (receiverData.relationClueChannel == 10008 || receiverData
      //       .relationClueChannel == 10009) && flag && receiverData.isPrivacy == 1) {
      //     this.receiverFlag = true
      //     this.userCustomerId = [receiverData.userCustomerId]
      //   } else if (!val && receiverData.userCustomerId) {

      //     this.userCustomerId = [receiverData.userCustomerId]
      //   } else {
      //     this.userCustomerId = val
      //   }
      //   this.selected = null
      //   if (retain) {
      //     this.distributionWay = retain
      //   }

      //   this.$refs.edit.show()
      //   this.columns = columnOpt.options(this)
      //   this.$refs.table.init(this)
      //   this.$refs.table.fetch()
      // },
      hide() {
        this.chooseConsultant = null
        this.$refs.edit.hide()
      },
    }
  }
</script>

<style lang="scss" scoped>
  .radioGroupClassBox {
    max-height: 500px;
    overflow-y: auto;
  }

  .radioGroupClass {
    display: block;
    width: 100%;
  }

  .radioClass {
    border-bottom: 1px solid #e8eaec;
    display: block;
    padding: 10px 10px 40px;
  }
</style>